import React, { Component } from 'react';
import store from './store/index'
import './App.css';
//导入antd 的css文件
import {getInitDataListBySaga} from './store/ActionCreators';
import ListUI from './ListUI';

class App extends Component {
  constructor(){
    super();
    this.state = {
      data : [
        
      ]
    }
    //this.storeChange = this.storeChange.bind(this);
    //store.subscribe(this.storeChange)
  }
  // storeChange(){
  //   this.setState(store.getState());
  // }
  //发送action
  // handlerChange(e){
  //   //调用ActionCreator里的方法
  //   var action = getInputChangeAction(e.target.value);
  //   store.dispatch(action);
  // }
  // addItem(){
  //   var action = getAddItemAction();
  //   store.dispatch(action);
  // }
  // handlerDeleteItem(e,index){
  //   var action = getDeleteItemAction(index);
  //   store.dispatch(action);
  // }
  componentDidMount(){
    // 这样可以传递发请求的参数
    // var action = getDataList(1);
    // store.dispatch(action);
    var action = getInitDataListBySaga();
    store.dispatch(action);
  }
  render() {
    
    return (
      <React.Fragment>
        {/* <h3>首页
        </h3>
        <Input placeholder="Basic usage" style={{width:'300px'}} onChange={e=>this.handlerChange(e)}/> <Button type="primary" onClick={e=>this.addItem()}>Primary</Button>
        <hr/>
      <List
        bordered
        dataSource={store.getState().list}
        renderItem={(item,index) => (<List.Item onClick={e=>{this.handlerDeleteItem(e,index)}}><Typography.Text mark>[ITEM]</Typography.Text> {item}</List.Item>)}
        style={{width:'500px'}}
      /> */}
      {/* 容器组件 */}
      {/* <ListUI dataSource={store.getState().list} handlerChange={this.handlerChange} addItem={this.addItem} handlerDeleteItem={this.handlerDeleteItem}></ListUI> */}
      <ListUI></ListUI>
      </React.Fragment>
    );
  }
}

export default App;
